接續上篇的從平面設計開始，下篇介紹開始製作UI的心得。

開始製作產品UI

接續上次的尋找參考資料，進入製作UI的流程會是：

1. 畫草圖
2. UI Flow
3. Wireframe
4. 精稿

• 畫草圖
  可以手繪或電繪草圖，這個階段就是將版面設定出來與團隊討論，且將功能大概定義好。

• UI Flow
  這個階段是依據Flow chart製作，這個階段會有基本框架，且需要劃出流程以便溝通。

• Wireframe
  這個階段呈現主要的排版雛形，用來討論正確配置，顏色和字體在這個階段不會放出。

• 精稿
  將整體完成，定義好標準色與標準字，並且將RWD的排版都製作好，這個階段有幾個小要點：

1. 各個物件的排版，各種數值，設定盡量維持整數
   這是讓工程師在看設計稿時，可以用乾淨的數字設定，很重要。

2. 各種文字和按鈕要統一設定
   各種元件變化不要太大，EX:按鈕有5種大小、顏色，變化太多不僅讓UI統一度不足，降低美觀，且也會讓工程師非常困擾。

3. 製作好範本起始元件
   例如製作一個按鈕，要留好起始範本，可以反覆複製與使用。

心得

下篇分享UX的製作心得。